<template>
    <div class="join">
        <ActivityList v-for="(item,index) in KeepCtivityList" :key="index" :dataList="item.activity_info" :callback="navigateToDetail" :itemIndex="index" :keepCallback="keep"/>
    </div>
</template>

<script>
import ActivityList from "../../components/activityList.vue"
import {
  getKeepActivityList,
  postActivityKeep,
  postCancelActivityKeep
 } from '../../api/index.js'
export default {
  data() {
    return {
      KeepCtivityList: [], //获取已经参加的活动数据
      limit: 4,
      page: 0,
      reachBottomFlag: true, // 没有数据了不再发送请求
    };
  },
  components: {
    ActivityList,
  },
  onShow(){
    this.page= 0;
    this.reachBottomFlag = true;
    this.KeepCtivityList = [];//每次进入组件重置，解决取消所有收藏时，与分页冲突产生的BUG
    this.reqKeepActivityList(); //获取已经收藏的活动数据
  },
  //下拉刷新
  onPullDownRefresh () {
    this.page= 0;
    this.reachBottomFlag = true;
    this.reqKeepActivityList();
  },
  //上拉加载
  onReachBottom () {
    if(this.reachBottomFlag){
      this.page++;
      this.reqKeepActivityList();
    }
  },
  methods: {
    //获取已经参加的活动数据
    async reqKeepActivityList(){
      let user_token = wx.getStorageSync('userToken');
      let params = {
        user_token : user_token,
        limit: this.limit,
        page: this.page
      };
      let res = await getKeepActivityList(params);
      if(res.data.level == "success"){
        let data = res.data.data;
        wx.stopPullDownRefresh()
        if(data.length > 0){
          if(this.page == 0){ 
            this.KeepCtivityList = data;
          }else{
            this.KeepCtivityList = this.KeepCtivityList.concat(data);
          }
        }else{
          if(this.KeepCtivityList.length > 0){
            this.reachBottomFlag = false;
          }else{
            wx.showToast({
              title: '暂无收藏活动',
              icon: 'none',
              duration: 2000
            })
          }
        }
      }else{
        wx.showToast({
          title: '获取活动列表失败',
          icon: 'none',
          duration: 1000
        })
      }
    },
    //跳转到对应活动详情
    navigateToDetail(activityInfo){
      wx.navigateTo({
        url: '/pages/detail/main?id='+activityInfo.id
      })
    },
    //点击收藏按钮
    keep(activity, index){
      var This = this;
      wx.showModal({
        title: '提示',
        content: '确定取消收藏？',
        success(res) {
          if (res.confirm) {
            This.reqCancelKeep(activity, index)
          }
        }
      })
    },
    //发送取消收藏请求
    async reqCancelKeep(activity,index){
      var userToken = wx.getStorageSync('userToken');
      let parmas = {
        user_token: userToken,
        activity_id: activity.id
      }
      let res = await postCancelActivityKeep(parmas);
      if(res.data.level == "success"){
       this.KeepCtivityList.splice(index,1);
        wx.showToast({
          title: '取消收藏成功',
          icon: 'none',
          duration: 1000
        })
      }else{
        wx.showToast({
          title: '取消收藏失败',
          icon: 'none',
          duration: 1000
        })
      }
    }
  }
}
</script>

<style lang="stylus" scoped>
  .join
    width 100%
    height 100vh
    background-color #f1f1f1
</style>